<template>
  <div>
    <item v-for="i in itemInfo" class="item" :path="i.path">
      <img :src="i.img" slot="left"/>
      <span slot="center">{{i.name}}</span>
      <span slot="right">></span>
    </item>
  </div>
</template>

<script>
  import item from "./tabItem.vue"
  export default{
    name:'',
    data(){
      return {
          itemInfo:[
            {
              img:require("../../../assets/img/profile/tab1.png"),
              name:"我的信息",
              path:"/userInfo"
            },
            {
              img:require("../../../assets/img/profile/tab2.png"),
              name:"我的钱包",
              path:"/userWallet"
            },
            {
              img:require("../../../assets/img/profile/tab3.png"),
              name:"我的账单",
              path:"/userOrder"
            },
            {
              img:require("../../../assets/img/profile/tab4.png"),
              name:"我的收藏",
              path:"/userLike"
            }
          ]
       }
    },
    computed:{

    },
    methods:{

    },
    components:{
      item
    }
  }
</script>

<style scoped>
  .item{
    height: 8vh;
    /* width: 80vh; */
    border: 1px solid #C0C0C0;
    font-size: 13px;
    display: flex;
    align-items: center;
  }
  img{
    width: 40px;
    margin-right: 10px;
    margin-left: 7px;
  }
</style>
